<template>
	<view class="content">
		 <view class="top">
		 	<view class="find">
		 		<image src="../../static/sousuo.png" mode="widthFix"></image>
		 	</view>
		 	<input placeholder="请输入搜索关键字..." class="input" v-model="input" @confirm="inputs"/>
		 </view>
		 
		 <view class="image">
			<image :src="$host+'noshops.jpg'" mode="widthFix"></image>
			 <view class="text">很抱歉，没有找到与“{{inputt}}”相关的产品。</view>
			 <view class="oh">可以去看看其他替代商品</view>
		 </view>
		 
	</view>
</template>

<script>
	export default{
		   data(){
			    return {
					$host:this.$host,
				     input:"",
					inputt:""
				}
		   },
	
		   onLoad(option) {
		   	  this.inputt=option.input
		   },
			   
		 
		   methods:{
			    inputs(){
			    		   			 if(this.input=="蛋糕" || this.input=="女生"){
											
			    		   					uni.navigateTo({
			    		   						 url:"/pages/person/gr"
			    		   					}) 
			    		   					  
			    		   				  }else if(this.input=="男生" || this.input=="男士"){
			    		   					      uni.navigateTo({
			    		   					      	url:"/pages/person/br"
			    		   					      })
			    		   				  }else if(this.input=="长辈" || this.input=="老人"){
			    		   					      uni.navigateTo({
			    		   					      	url:"/pages/person/old"
			    		   					      })
			    		   				  }else if(this.input=="小孩" || this.input=="男孩"){
			    		   					      uni.navigateTo({
			    		   					      	url:"/pages/person/boy"
			    		   					      })
			    		   				  }else if(this.input=="面包" || this.input=="零食"){
			    		   					      uni.navigateTo({
			    		   					     url:"/pages/person/ls"
			    		   					      })
			    		   				  }else if(this.input=="饮品" || this.input=="饮料"){
			    		   					      uni.navigateTo({
			    		   					      	url:"/pages/person/drink"
			    		   					      })
			    		   				  }else if(this.input=="4寸" || this.input=="四寸蛋糕"){
			    		   					      uni.navigateTo({
			    		   					      	url:"/pages/person/four"
			    		   					      })
			    		   				  }else{
											    this.inputt=this.input
										  }
			    		   				  
			    		   				   
			    }
		   }
	}
</script>

<style>
	.oh{
		color: #bbbbbb;
		margin-top: 20rpx;
	}
	.image>image{
		width: 160px;
	}
	.image{
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 87px;
	}
	.top {
		height: 100rpx;
		width: 100%;
		
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.input {
		/* border: 1px solid grey; */
		flex-basis: 84%;
		height: 70rpx;
		background-color: #f6f6f6;
		border-radius: 30rpx;
		padding-left: 82rpx;
	
	
	}
	
	.find>image {
		width: 50rpx;
	}
	
	.find {
		width: 50rpx;
		position: absolute;
		top: 26rpx;
		left: 42rpx;
	}
</style>